<template>
    <div class="app-container on-passage-page">
        <FilterForm
            :data="filterData"
            label-width="85px"
            @search="filterSearch"
            ref="FilterForm"
        />

        <el-row :gutter="10" class="opr-btn-group mb8">
            <el-col :span="1.5">
                <el-button
                    type="primary"
                    plain
                    icon="el-icon-plus"
                    size="mini"
                    @click="handleEdit()"
                    v-hasPermi="['woodPurchase:woodPurchaseInGoods:upBinPartialState']"
                    >新增</el-button
                >
            </el-col>
            <el-col :span="1.5">
                <el-button
                    type="warning"
                    plain
                    icon="el-icon-download"
                    size="mini"
                    :loading="exportLoading"
                    @click="handleExport"
                    v-hasPermi="['woodPurchase:woodPurchaseInGoods:export']"
                    >导出</el-button
                >
            </el-col>

            <el-col :span="1.5">
                <el-button
                    type="success"
                    plain
                    size="mini"
                    @click="handleAudit(1)"
                    v-hasPermi="['woodPurchase:woodPurchaseInGoods:upBinPartialState']"
                    >入库</el-button
                >
            </el-col>
            <el-col :span="1.5">
                <el-button
                    type="success"
                    plain
                    size="mini"
                    @click="handleAudit(0)"
                    v-hasPermi="['woodPurchase:woodPurchaseInGoods:remove']"
                    >撤销</el-button
                >
            </el-col>
        </el-row>

        <Table
            :api="$Api.woodPurchase.bin.partial"
            :params="params.query"
            :selection="true"
            :sort="false"
            ref="TableList"
            height="56vh"
            @dbClick="dbClick"
            @select="selectTable"
        >
            <el-table-column
                label="操作"
                align="center"
                width="120"
                class-name="small-padding fixed-width"
            >
                <template slot-scope="scope"
                    ><el-button
                        size="mini"
                        type="text"
                        icon="el-icon-edit"
                        @click.native.stop="dbClick(scope.row)"
                        v-hasPermi="['system:user:edit']"
                        >修改</el-button
                    >
                    <el-button
                        size="mini"
                        type="text"
                        icon="el-icon-delete"
                        @click.native.stop="handleDelete(scope.row)"
                        v-hasPermi="['system:user:remove']"
                        >删除</el-button
                    >
                </template>
            </el-table-column>

            <el-table-column label="入库日期" width="120">
                <template slot-scope="scope">
                    <span>{{
                        scope.row.status == 1 ? scope.row.inTime : ""
                    }}</span>
                </template>
            </el-table-column>
            <el-table-column label="箱号" prop="caseNum" width="120" />
            <el-table-column label="品名" prop="goodsName" width="180" />
            <el-table-column
                label="提单号"
                prop="woodPurchaseInModel.ladingNum"
                width="160"
            />
            <el-table-column
                label="合同号"
                prop="woodPurchaseInModel.pactNum"
                width="160"
            />
            <el-table-column label="仓库" prop="warehouse" width="120" />
            <el-table-column label="件数" prop="pieceCount" />
            <el-table-column label="方数" prop="inCount" width="120" />
            <el-table-column label="码单方数" prop="noteCount" width="120" />
            <el-table-column label="费用" prop="money" width="120" />
            <el-table-column
                label="供应商"
                prop="woodPurchaseInModel.supplierName"
                width="200"
            />
            <el-table-column
                label="开证公司"
                prop="woodPurchaseInModel.pactName"
                width="200"
            />

            <el-table-column label="备注" prop="remark" width="240" />
            <el-table-column label="入库人" prop="inBy" fixed="right" />
            <el-table-column label="入库状态" align="center" fixed="right">
                <template slot-scope="scope" v-if="scope.row.goodsName">
                    <span class="success" v-if="scope.row.status == 1"
                        >已入库</span
                    >
                    <span class="error" v-else>未入库</span>
                </template>
            </el-table-column>
        </Table>

        <!-- 添加或修改木业商品信息对话框 -->
        <el-dialog
            title="新增箱柜"
            :visible.sync="dialog.edit"
            width="1000px"
            append-to-body
            :close-on-click-modal="false"
        >
            <el-form
                ref="form"
                :model="params.form"
                label-width="80px"
                :inline="true"
            >
                <el-form-item
                    label="提单号"
                    required
                    :prop="params.form.ladingNum"
                >
                    <SearchInput
                        v-model="params.form.ladingNum"
                        placeholder="请选择提单号"
                        :api="$Api.woodPurchase.in.list"
                        searchKey="ladingNum"
                        selectLabel="ladingNum"
                    />
                </el-form-item>
                <el-form-item label="箱号" required :prop="params.form.caseNum">
                    <el-input
                        v-model="params.form.caseNum"
                        placeholder="请选输入箱号"
                    />
                </el-form-item>
            </el-form>
            <!-- 表格开始 -->
            <TableForm
                ref="TableForm"
                :list="params.tableForm"
                :renderData="tableFormRender"
                :summary="true"
            />
            <div slot="footer" class="dialog-footer">
                <el-button
                    type="primary"
                    @click="submitForm"
                    :loading="loading.submit"
                    >确 定</el-button
                >
                <el-button @click="cancel">取 消</el-button>
            </div>
        </el-dialog>

        <!-- 入库对话框 -->
        <el-dialog
            title="箱柜入库"
            :visible.sync="dialog.in"
            width="1000px"
            append-to-body
            :close-on-click-modal="false"
        >
            <TableForm
                ref="TableInForm"
                :list="params.select"
                :renderData="tableFormInRender"
                :summary="true"
                :closeOpr="true"
            />
            <div class="btn-group">
                <el-button type="primary" @click.native.stop="handleIn()"
                    >确认</el-button
                >
                <el-button @click.native.stop="dialogClose">关闭</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import TableForm from "@/components/TableForm";
import SearchInput from "@/components/SearchInput";

export default {
    components: {
        TableForm,
        SearchInput,
    },
    data: () => {
        return {
            params: {
                // 搜索参数
                query: {},
                form: {},
                tableForm: [{}],
                select: [],
            },
            showSearch: true,
            exportLoading: false,
            dialog: {
                edit: false,
                in: false,
            },
            rules: {},
            tableFormRender: [],
            tableFormInRender: [],
            filterData: [
                {
                    label: "入库日期",
                    st: "beginInTime",
                    end: "endInTime",
                    type: "period_date",
                    scale: 2,
                },
                {
                    label: "箱号",
                    name: "caseNum",
                },
                {
                    label: "提单号",
                    name: "ladingNum",
                },
                {
                    label: "品名",
                    name: "goodsName",
                    type: "select",
                    select: "goodsName",
                },
                {
                    label: "仓库",
                    name: "warehouse",
                    type: "select",
                    select: "warehouse",
                },
                {
                    label: "供应商",
                    name: "supplierName",
                    type: "supplier",
                },
                {
                    label: "开证公司",
                    name: "pactName",
                    type: "supplier",
                },
                {
                    label: "合同号",
                    name: "pactNum",
                },
            ],
            loading: {
                submit: false,
            },
        };
    },
    created() {
        this.tableFormRender = [
            { label: "包号", value: "baleNum" },
            {
                label: "品名",
                value: "goodsName",
                select: "goodsName",
                rules: [
                    {
                        required: true,
                        message: "请选择品名",
                        trigger: "blur",
                    },
                ],
            },
            {
                label: "品牌(批量)",
                value: "brandName",
                select: "productName",
                rules: [
                    {
                        required: true,
                        message: "请选择品牌",
                        trigger: "blur",
                    },
                ],
            },
            {
                label: "等级(批量)",
                value: "level",
                select: "levelName",
                rules: [
                    {
                        required: true,
                        message: "请选择等级",
                        trigger: "blur",
                    },
                ],
            },
            {
                label: "仓库(批量)",
                value: "warehouse",
                select: "warehouse",
                rules: [
                    {
                        required: true,
                        message: "请选择仓库",
                        trigger: "blur",
                    },
                ],
            },
            { label: "库位(批量)", value: "storageLocation" },
            {
                label: "厚度(mm)",
                value: "ply",
                inputType: "number",
                onchange: this.checkOneCount,
                rules: [
                    {
                        min: 0.01,
                        type: "number",
                        message: "请输入厚度",
                        trigger: "blur",
                    },
                ],
            },
            {
                label: "宽度(mm)",
                value: "width",
                inputType: "number",
                onchange: this.checkOneCount,
                rules: [
                    {
                        min: 0.01,
                        type: "number",
                        message: "请输入宽度",
                        trigger: "blur",
                    },
                ],
            },
            {
                label: "长度(m)",
                value: "length",
                inputType: "number",
                onchange: this.checkOneCount,
                rules: [
                    {
                        min: 0.01,
                        type: "number",
                        message: "请输入长度",
                        trigger: "blur",
                    },
                ],
            },
            {
                label: "片数",
                value: "sliceCount",
                inputType: "number",
                onchange: this.checkOneCount,
                rules: [
                    {
                        required: true,
                        message: "请输入片数",
                        trigger: "blur",
                    },
                    {
                        min: 1,
                        type: "number",
                        message: "请输入片数",
                        trigger: "blur",
                    },
                ],
            },
            {
                label: "件数",
                value: "pieceCount",
                inputType: "number",
                onchange: [this.inCount, this.noteCount],
                summary: true,
                rules: [
                    {
                        required: true,
                        message: "请输入件数",
                        trigger: "blur",
                    },
                    {
                        min: 1,
                        type: "number",
                        message: "请输入件数",
                        trigger: "blur",
                    },
                ],
            },

            {
                label: "单包方数",
                value: "oneCount",
                inputType: "number",
                decimal: 3,
                onchange: this.inCount,
                checkSame: "oneCount,oneNoteCount",
            },
            {
                label: "方数",
                value: "inCount",
                inputType: "none",
                decimal: 3,
                checkSame: "inCount,noteCount",
                summary: true,
            },
            {
                label: "单包码单",
                value: "oneNoteCount",
                inputType: "number",
                decimal: 3,
                onchange: [this.noteCount, this.moneyCount],
                checkSame: "oneCount,oneNoteCount",
            },
            {
                label: "码单",
                value: "noteCount",
                inputType: "none",
                decimal: 3,
                checkSame: "inCount,noteCount",
                summary: true,
            },
            {
                label: "单价(批量)",
                value: "price",
                inputType: "number",
                decimal: 3,
                onchange: this.moneyCount,
                rules: [
                    {
                        min: 0.01,
                        type: "number",
                        message: "请输入单价",
                        trigger: "blur",
                    },
                ],
            },
            {
                label: "金额",
                value: "money",
                inputType: "none",
                summary: true,
            },
            {
                label: "货物状态",
                value: "goodsState",
            },
            {
                label: "产地",
                value: "originPlace",
            },
            {
                label: "备注",
                value: "remark",
            },
        ];

        this.tableFormInRender = [
            { label: "提单号", value: "ladingNum", inputType: "none" },
            { label: "箱号", value: "caseNum", inputType: "none" },
            {
                label: "件数",
                value: "pieceCount",
                inputType: "none",
                summary: true,
            },
            {
                label: "方数",
                value: "inCount",
                inputType: "none",
                summary: true,
            },
            {
                label: "入库时间(批量)",
                value: "inTime",
                inputType: "date",
                width: 180,
                rules: [
                    {
                        required: true,
                        message: "入库时间",
                        trigger: "blur",
                    },
                ],
            },
            {
                label: "仓库(批量)",
                value: "warehouse",
                select: "warehouse",
                rules: [
                    {
                        required: true,
                        message: "请选择仓库",
                        trigger: "blur",
                    },
                ],
                width: 140,
            },
            {
                label: "费用(批量)",
                value: "money",
                inputType: "number",
                summary: true,
                rules: [
                    { required: true, message: "请输入费用", trigger: "blur" },
                    {
                        min: 0.01,
                        type: "number",
                        message: "请输入单价",
                        trigger: "blur",
                    },
                ],
            },
            { label: "备注(批量)", value: "remark", width: "auto" },
        ];
    },
    methods: {
        selectTable(d) {
            let select = JSON.parse(JSON.stringify(d));
            select.forEach((v) => {
                let _warehouse = v.warehouse.split(",");
                v.warehouse = _warehouse.length ? _warehouse[0] : "";

                v.ids = v.itemId.split(",");
                v.ladingNum = v.woodPurchaseInModel.ladingNum;
            });
            this.params.select = select;
        },
        dbClick(row) {
            let { caseNum, status } = row;

            let { ladingNum, pactNum, pactName, supplierName, orderId } =
                row.woodPurchaseInModel;

            let query = {
                caseNum,
                ladingNum,
                pactNum,
                pactName,
                supplierName,
                orderId,
                status,
            };

            sessionStorage.setItem(
                `binPartiaDetail_${caseNum}`,
                JSON.stringify(query)
            );
            this.$router.push({
                path: `/purchase/bin/detail/${caseNum}`,
            });
        },
        filterSearch(params) {
            this.$refs.TableList.getData(params);
        },
        handleEdit() {
            this.dialog.edit = true;
        },
        handleDelete(row) {
            let { FilterForm } = this.$refs;
            let { itemId } = row;
            this.$confirm(
                '是否确认删除采购订单信息编号为"' + itemId + '"的数据项?',
                "警告",
                {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning",
                }
            ).then(() => {
                this.$Api.woodPurchase.bin.del(itemId).then((res) => {
                    this.msgSuccess(res.msg);
                    FilterForm.search();
                });
            });
        },
        handleExport() {},
        submitForm() {
            let { tableForm } = this.params;
            let { ladingNum, caseNum } = this.params.form;
            let { TableList, TableForm } = this.$refs;

            if (!ladingNum) {
                this.$message.error("请选择提单号");
                return false;
            }

            if (!caseNum) {
                this.$message.error("请输入箱号");
                return false;
            }

            TableForm.checkForm((pass) => {
                if (pass) {
                    this.loading.submit = true;
                    this.$Api.woodPurchase.bin
                        .add({
                            caseNum,
                            ladingNum,
                            woodPurchaseInGoods: tableForm,
                        })
                        .then((res) => {
                            this.msgSuccess("新增成功");
                            this.clearForm();
                            this.dialog.edit = false;
                            this.loading.submit = false;
                            TableList.getData();
                        });
                }
            });
        },
        clearForm() {
            this.params.tableForm = [{}];
            this.params.form = {};
        },
        cancel() {
            this.dialog.edit = false;
            this.clearForm();
        },
        // 金额计算 ： 单价 * 码单
        moneyCount(d) {
            let { noteCount, price } = d;
            let t = noteCount * price;
            t = t.toFixed(3);
            d.money = t;
        },
        // 单包方数计算 ：厚度/1000*宽度/1000*长度*片数*件数
        checkOneCount(d) {
            let { ply, width, length, sliceCount, pieceCount } = d;
            if (!ply || !width || !length || !sliceCount) return false;
            let t = (ply * width * length * sliceCount) / 1000000;
            d.oneCount = t;
            !d.oneNoteCount && (d.oneNoteCount = t);
        },
        // 码单计算  单包码单* 件数
        noteCount(d) {
            let { oneNoteCount, pieceCount } = d;
            let t = (oneNoteCount || 0) * (pieceCount || 0);
            t = t.toFixed(3);
            d.noteCount = t;
        },
        // 方数计算 单包方数*件数
        inCount(d) {
            let { oneCount, pieceCount } = d;
            let t = ((oneCount || 0) * (pieceCount || 0)).toFixed(3);
            d.inCount = t;
            !Number(d.noteCount) && (d.noteCount = t);
        },
        dialogClose() {
            this.dialog.in = false;
        },
        handleAudit(audit) {
            let { select } = this.params;
            if (!select.length) {
                this.$message.error("请至少选择一条数据");
                return false;
            }

            if (audit == 1) {
                this.dialog.in = true;
            } else {
                this.handleIn(true);
            }
        },
        handleIn(repeal = false) {
            let { TableInForm } = this.$refs;

            if (repeal) {
                this.setState(repeal);
                return false;
            }

            TableInForm.checkForm((pass) => {
                pass && this.setState();
            });
        },
        setState(repeal = false) {
            let { FilterForm } = this.$refs;
            let { select } = this.params;
            let postData = {
                woodPurchaseInGoodsDto: select,
                type: 2,
            };
            if (repeal) {
                postData.repeal = 1;
                postData.woodPurchaseInGoodsDto = select.map((v) => {
                    let ids = v.itemId.split(",");
                    return { ids };
                });
            }
            this.$Api.woodPurchase.bin
                .setState(postData)
                .then((res) => {
                    this.dialogClose();
                    this.$message.success("操作成功");
                    FilterForm.search();
                })
                .catch(() => {
                    FilterForm.search();
                });
        },
    },
};
</script>

<style lang="scss" scoped>
.btn-group {
    margin: 20px 15px 0 0;
    text-align: right;
}
.success {
    color: #67c23a;
}
.error {
    color: #f56c6c;
}
</style>